<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Jay Skript and the Domsters</title>
    <script src="./scripts/modernizr-custom.js"></script>
    <!-- 引入重置样式表 -->
    <link rel="stylesheet" href="./styles/reset.css">
    <!-- 引入基本层叠样式表 -->
    <link rel="stylesheet" href="./styles/basic.css">
</head>
<body>
    <header>
        <img src="./images/logo.gif" alt="Jay Skript and the Domsters">
        <nav>
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="about.html">About</a></li>
                <li><a href="photos.html">Photos</a></li>
                <li><a href="live.html">Live</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </nav>
    </header>
    <!-- 实现图片库功能 -->
    <article>
        <h1>Photos of the band</h1>
        <ul id="imagegallery">
            <li>
                <a href="images/photos/concert.jpg" title="The crowd goes wild">
                    <img src="images/photos/thumbnail_concert.jpg" alt="the band in concert" />
                </a>
            </li>
            <li>
                <a href="images/photos/bassist.jpg" title="An atmospheric moment">
                    <img src="images/photos/thumbnail_bassist.jpg" alt="the bassist" />
                </a>
            </li>
            <li>
                <a href="images/photos/guitarist.jpg" title="Rocking out">
                    <img src="images/photos/thumbnail_guitarist.jpg" alt="the guitarist" />
                </a>
            </li>
            <li>
                <a href="images/photos/crowd.jpg" title="Encore! Encore!">
                    <img src="images/photos/thumbnail_crowd.jpg" alt="the audience" />
                </a>
            </li>
        </ul>
    </article>
    <script src="./scripts/global.min.js"></script>
</body>

</html>